<template>
    <div>
      <!-- 批量传递可以利用v-bind发送，因为v-bind在解析属性时是 id='001',name='laowang',age='18' 这样解析标签名，所以后面可以通过解构的样式拿到对应的属性的值
        ~~但切记不能将v-bind=''变为 v-bind：xxx=''  这样相当于给xxxx增加''属性标签
      -->
      <MyCount  v-bind='person' />
      <!-- <MyCount   id='001',name='laowang',age='18' /> -->
      <hr>
      <!-- props传参 父子通信  在组件上传参 传给子级 -->
      <MyHeader  :num='2'/>
        <hr>
      <MyHeader  :num='3'/>
    </div>

</template>

<script>
//引入就要用，不然会报错
import MyCount from './components/MyCount';
import MyHeader from './components/MyHeader';
export default {
  name:"APP",
  components:{
    MyCount,
    MyHeader
  },
  data(){
    return {
      person:{id:'001',name:'laowang',age:'18'}
    }
  }
//vue中props数据传输不建议修改  第一是会eslint会报错 第二 vue也会警告
//如果props是个对象 修改内部值 不会报错 因为对象的值地址没变，但是依然不建议修改  这样很危险

}
</script>

<style>

</style>